@extends('admin.main')
@section('head')
    <link href="/static/datetimepicker/css/datetimepicker.css" rel="stylesheet" type="text/css">
    @if(C('COLOR_STYLE')=='blue_color') <link href="/static/datetimepicker/css/datetimepicker_blue.css" rel="stylesheet" type="text/css">'@endif
    <link href="/static/datetimepicker/css/dropdown.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="/static/datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
    <script type="text/javascript" src="/static/datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js" charset="UTF-8"></script>
    <script type="text/javascript" src="/admin/js/echarts.common.min.js"></script>
    <script type="text/javascript" src="/admin/js/echart-canvas.js"></script>
    <style>
        .tab{display: flex; /*border-bottom: 1px solid;*/}
        a{color: black;!important;}
        .tab_p  a:hover {color:black;text-decoration:none;!important;}
        .tab_p{padding: 0.5rem 1rem;color: #445566!important;cursor:pointer}
        .none{display: none;}
        .tab_active{font-size: 1.1rem;background: #86db00;color: #fff!important;}
        .tab_active a{color: #fff!important;}
        .search-form{margin: 1rem;display: flex;display: -webkit-flex;align-items: center;-webkit-align-items:center;}
        .search-form .search-input {float: left;padding: 0.5rem; !important width: 20rem; !important height: 24px;line-height: 26px;border: 0 none;}
        .search-form .sch-btn {float: left;margin: 2px 2px 0 0;padding: 0.5rem 10px; !important height: 26px;!important line-height: 26px;!important vertical-align: middle;}
        .tab_content{border: 1px solid #ccc}
        .content{width: 100%;}
        .searc_time{padding: 0 1rem;}
        .button{background: #86db00;padding: 0.3rem 1rem;color: #fff;border-radius: 4px;border: none;}
        .marginT_5{margin-top: 5rem;}
        .eChart-div{display: flex;display: -webkit-flex;justify-content: space-between;-webkit-justify-content: space-between;}
        .current{background: grey}
    </style>
@endsection
@section('body')
    <div class="main-title">
        <!-- 标题栏 -->
        <h2>数据统计</h2>
    </div>
    <div class="tab">
        <p class='tab_p @if($type == 'money') tab_active @endif'><a href="{{urlPlat($ctr, $action, ['type' => 'money'])}}">营收统计</a></p>
        <p class='tab_p @if($type == 'delivery') tab_active @endif'><a href="{{urlPlat($ctr, $action, ['type' => 'delivery'])}}">配送统计</a></p>
        <p class='tab_p @if($type == 'bill') tab_active @endif'><a href="{{urlPlat($ctr, $action, ['type' => 'bill'])}}">水票统计</a></p>
        <p class='tab_p @if($type == 'bucket') tab_active @endif'><a href="{{urlPlat($ctr, $action, ['type' => 'bucket'])}}">水桶统计</a></p>
        <p class='tab_p @if($type == 'deposit') tab_active @endif'><a href="{{urlPlat($ctr, $action, ['type' => 'deposit'])}}">押金统计</a></p>

    </div>
    <div class='tab_content tab_content1'>
        <div class="cf">
            <!-- 高级搜索 -->
            <div class="search-form fr cf">
                <div style="float: left;margin-right: 10px;line-height: 44px;">
                    <select name="shop_id" id="shop_id" style="height: 30px;">
                        <option value="0" @if(request('shop_id') == 0) selected @endif>请选择店铺</option>
                        @if(count($shops))
                            @foreach($shops as $val)
                                @if(session('shop_info'))
                                    <option value="{{$val['id']}}" @if(session('shop_info.id') == $val['id']) selected @endif>{{$val['shop_name']}}</option>
                                @else
                                    <option value="{{$val['id']}}" @if(request('shop_id') == $val['id']) selected @endif>{{$val['shop_name']}}</option>
                                @endif
                            @endforeach
                        @endif
                    </select>
                </div>
                @if(in_array($type,['money','bill','delivery']))
                    <div class="searc_time cf">
                        <div class="row">
                            <label>下单时间：</label>
                            <input type="text" id="time_start" name="time_start" class="text input-2x" value="{{request('time_start')}}" placeholder="起始时间" /> -
                            <input type="text" id="time_end" name="time_end" class="text input-2x" value="{{request('time_end')}}" placeholder="结束时间" />
                        </div>

                    </div>
                @endif
                <div><input type="hidden" name="type" id="type" value="{{$type}}" /></div>
                <div><button class='button' type='button' id="search" url="{{urlPlat($ctr,$action)}}">搜索</button></div>
            </div>
        </div>
        <div class='content'>
            @include($subView)
        </div>
    </div>
@endsection

@section('script')
    <script type="text/javascript">
        $('#time_start').datetimepicker({
            format: 'yyyy-mm-dd',
            language:"zh-CN",
            minView:2,
            autoclose:true
        });
        $('#time_end').datetimepicker({
            format: 'yyyy-mm-dd',
            language:"zh-CN",
            minView:2,
            autoclose:true
        });

        $(function () {
            var current = '{!! date('Y-m-d') !!}';
            var start = $("#time_start").val();
            var end = $("#time_start").val();
            if(start == '') {
                $("#time_start").val(current);
            }
            if(end == ''){
                $("#time_end").val(current);
            }
        })

        $("#search").click(function(){
            var url = $(this).attr('url');
            var type = $("#type").val();
            var time_start = $("#time_start").val() || '';
            var time_end = $("#time_end").val() || '';
            var shop_id = $("#shop_id").val()
            if (url.indexOf('?') < 1) {
                url += '?type=' + type;
            }
            if(shop_id > 0){
                url += '&shop_id=' + shop_id
            }
            if(time_start) {
                url += '&time_start=' + time_start
            }
            if(time_end) {
                url += '&time_end=' + time_end
            }
            if(time_start && time_end){
                if(!compareDate(time_start, time_end)){
                    alert('开始时间不能大于结束时间！');
                    return false;
                }
            }
            window.location.href = url;
        })
    </script>
@endsection
